<template>
    <div class="footermax">
        <div class="headerselect">
            <el-select v-model="unitId" size="mini" placeholder="请选择" style="width:150px"> 
                <el-option v-for="item in unitList" :key="item.id"
                :label="item.label" :value="item.id"></el-option>
            </el-select>

            <el-select v-model="officeId" size="mini" placeholder="请选择" style="width:150px;margin:0 25px"> 
                <el-option v-for="item in officeList" :key="item.id"
                :label="item.label" :value="item.id"></el-option>
            </el-select>

            <el-select v-model="cooperaId" size="mini" placeholder="请选择" style="width:150px"> 
                <el-option v-for="item in cooperaList" :key="item.id"
                :label="item.label" :value="item.id"></el-option>
            </el-select>
        </div>
    </div>
</template>

<script>
export default {
    data(){
        return{
            unitId:'1', // 所属单位
            officeId:'1', //上网机关
            cooperaId:'1', //合作伙伴
            unitList:[
                {id:'1', label:'所属单位网站'},
                {id:'2', label:'所属单位电脑'},
                {id:'3', label:'所属单位手机'}
            ],
            officeList:[
                {id:'1', label:'上网机关网站'},
                {id:'2', label:'上网机关电脑'},
                {id:'3', label:'上网机关手机'}
            ],
            cooperaList:[
                {id:'1', label:'合作伙伴网站'},
                {id:'2', label:'合作伙伴电脑'},
                {id:'3', label:'合作伙伴手机'}
            ],
        }
    }
}
</script>

<style scoped>
    .footermax{
        width: 100%;
        height: 100%;
        background: #EDF2F7;    
    }
    .headerselect{
        height: 40px;
        width: 100%;
        /* border: 1px solid #000; */
        display: flex;
        justify-content: center;
        align-items: center;
    }
</style>